<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="created" content="2018-10-23T06:18:10.521000000">
    <meta name="changed" content="2018-10-23T06:18:42.262000000">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Language" content="pt">
    <title>
      The Canvas
    </title>
    <link rel="stylesheet" type="text/css" href="../../style.css">
  </head>
  <body>
    <div class="maindiv">
      <h1>
        The Canvas
      </h1>
      <p>
        The canvas is really the most visible part of Liogisim-evolution is where you draw your circuits and their symbol to finally simulate the operation.
      </p>
      <p align="center">
        <img src="../../../img-guide/tutorial-shot-labeled.png" alt="#########">
      </p>
      <p>
        It is composed of only a few elements:<br>
      </p>
      <p>
        <b>Horizontal and vertical scroll bars</b> : They work as in most programs, just drag the sliders to move the view to other parts of the drawing. They can also be manipulated from the keyboard or mouse with the following combinations:
      </p>
      <ul>
        <li>Mouse wheel or keys <b class="tkeybd">low/up arrow</b> : vertical scrolling
        </li>
        <li>
          <b class="tkeybd">Alt-Mouse wheel</b> or keys <b class="tkeybd">right/left arrow</b>: horizontal scrolling
        </li>
        <li>Key <b class="tkeybd">PgUp</b> : go to the top of the page
        </li>
        <li>Key <b class="tkeybd">PgDn</b> : go to bottom of page
        </li>
      </ul>
      <p>
        <b>The zoom :</b>On the bottom left is the display of the current zoom factor (100% in the figure). you can change it with the two buttons to the right of the rate display or with <b class="tkeybd">Ctrl</b> + mouse wheel
      </p>
      <p align="center">
        <img class="notscal" src="../../../../img-guide/zoom.png" alt="#########">
      </p>
      <p>
        <b>The grid button :</b> On the right of the zoom, Toggle mode alternately <b>"grid displayed"</b> in the mode <b>"invisible grid"</b>.
      </p>
      <p>
        <b>Next:</b> <a href="gui-menu.html">The menus</a>.
      </p>
    </div>
  </body>
</html>
